Hello World
May 04, 2019
前情提要
两年前(2017)搞了一个， 也就是这里,采用的当时流行的Jekyll，它是基于Ruby语言的。但是它有个很诱人的特点就是可以很方便的免费使用Github Pages来做静态网站。步骤如下：
-
选择一个theme，Jekyllthemes里有很多，我采用的是Minimal Mistakes。
-
创建一个域名，没啥说的。我使用的GoDaddy，但并不推荐。
-
配置DNS，一个是A，指向github pages的。 一个是CNAME，指向你github的网站。
-
当时的github pages还没有支持SSL，所以中间又转了一层，加了Cloudflare，这里有教程
简单来说： Github Pages + Cloudflare/ Godaddy + Jkeyll
目前动机
上面网站我写了一些文章后发现，主要都是生活方面的。 还是想打算找个地方专门写技术文章。所以转到这里为艺术而技术
这次采用的平台是Gatsby。本来还是享用Github Pages来做，结果不支持，也就是说你必须每次手动把生成的东西放上去。还好Netlify支持，也就是自动发现Github Repo的更新并发布。另外还有个bonus：SSL，不用再麻烦Cloudflare，其实现在的Github Pages也已经支持SSL了.
简单来说: Netlify + Godaddy + Gatsby
目的就是写 有趣 并 有用 的文章
语法高亮显示
def foldRight[A, B](as: List[A], z: B)(f: (A, B) => B): B =
as match {
case Nil => z
case Cons(x, xs) => f(x, foldRight(xs, z)(f))var s = "JavaScript syntax highlighting";
alert(s);s = "Python syntax highlighting"
print sclass Test{
public static void main(String args[]){
System.out.println("Java syntax highlighting");
}
}默认starter blog 不支持上面的语言高亮显示，根据这篇文章需要在 gatsby-browser.js 里面加上下面这行：
require("prismjs/themes/prism-solarizedlight.css")加上google Analysitics
使用gatsby-plugin-google-analytics。
在gatsby-config.js 加上下面：
{
resolve: `gatsby-plugin-google-analytics`,
options: {
trackingId: "UA-XXXXXXXXX-X",
},
},加上Disqus评论
-
在Disqus注册而获得一个shortname
-
增加包
yarn add disqus-react或者
npm install disqus-react --save- 修改src/templates/blog-posts.js
import { DiscussionEmbed } from "disqus-react";在render()方法里添加
const disqusShortname = "yourdisqusshortname";
const disqusConfig = {
identifier: post.id,
title: post.frontmatter.title,
};在UI部分添加
<DiscussionEmbed shortname={disqusShortname} config={disqusConfig} />增加adsense
采用gatsby-plugin-google-adsense
// In your gatsby-config.js file
plugins: [
{
resolve: `gatsby-plugin-google-adsense`,
options: {
publisherId: `ca-pub-xxxxxxxxxx`
},
},
]致谢
https://daveceddia.com/start-blog-gatsby-netlify/
